<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>综合服务系统</title>
    <!--公用样式-->
    <link rel="stylesheet" type="text/css" href="${re.contextPath}/plugin/common/css/comment.css"/>
    <!--页面样式-->
    <link rel="stylesheet" type="text/css" href="${re.contextPath}/plugin/it/common/css/style.css"/>
    <!--Layui-->
    <#--    <link rel="stylesheet" href="${re.contextPath}/plugin/layui/css/layui.css" media="all"/>-->
    <link rel="stylesheet" href="${re.contextPath}/plugin/layui2.6.7/css/layui.css" media="all"/>

    <!--扩展样式-->
    <link rel="stylesheet" href="${re.contextPath}/plugin/common/css/extended.css">
    <style>

        .layui-nav-tree .layui-nav-item a:hover {
            background-color: #5775EF !important;
        }

        .layui-nav-itemed > .layui-nav-child {
            background-color: #485484 !important;
        }

        .layui-nav-tree .layui-nav-bar {
            display: none;
            background-color: #f30a11 !important;
        }

        .layui-nav .layui-nav-child dd.layui-this a, .layui-nav-child dd.layui-this {
            background-color: #485484;
        }

        #ul_jl_tabs li {
            padding: 0 10px;
        }

        #ul_jl_tabs li img {
            /*margin-top: 4px!important;*/
        }

        .layui-nav-tree .layui-this > a {
            background-color: #5775EF !important;
        }

        .layui-nav-tree .layui-this {
            background-color: #5775EF !important;
        }

        .column > div {
            /*padding-bottom: 11px;*/
        }

        .column ul li {
            height: 30px;
            padding: 6px 8px;
        }

        .column ul li {
            line-height: 30px;
        }

        .column ul {
            position: absolute;
            bottom: 8px;
        }

        .web_title {
            color: #FFFFFF;
            float: left;
            line-height: 85px;
            margin-left: 20px;
            font-size: 18px;
        }

        .mineData {
            height: 85px;
            color: #FFFFFF;
        }

        .layui-menu-item-checked {
            color: #5775EF !important;
        }

        .layui-menu-item-checked:after {
            border-right-color: #5775EF !important;
        }

        .Left ul a {
            color: #000000;
            /*    font-size: 16px;*/
        }

        .layui-menu .layui-menu-item-group > .layui-menu-body-title {
            color: #333;
        }

        .layui-menu-item-group .layui-menu-body-title, .layui-menu-item-parent .layui-menu-body-title {
            /*padding-left: 25px;*/
        }

    </style>
</head>

<body>
<!--头部-->
<header class="whitebg">
    <div class="clearfix">
        <a href="/main">
            <img src="${re.contextPath}/plugin/common/images/2@2x.png" class="logo fl" alt=""/>
        </a>
        <div class="web_title">在线考试系统</div>
        <div class="mineData fr clearfix">
            <#if "${file}" !="${null}" && (file.xgtx) != "${null}">
                <img class="ml10" src="${file.xgtx}" style="margin-top: 7.5px;" alt="" id="mainimg7">
            <#else>
                <#if "${user}" !="${null}" && (user.personType) == "002">
                    <img class="layui-upload-img ml10" id="mainimg7" src="/plugin/common/images/zzlogo.jpg" alt="">
                <#else>
                    <img class="layui-upload-img ml10" id="mainimg7"
                         src="${re.contextPath}/plugin/common/images/29@2x.png" alt="">
                </#if>
            </#if>
            <nav class="fl ml10" style="margin-top: 7.5px;">
                <p class="fr18" style="color: #0a0a0a"><#assign currentUser = Session["currentPrincipal"]>
                    ${currentUser.username} </p>
                <p class="gary" style="">
                    <a href="${re.contextPath}/logout" style="color: #0a0a0a;">
                        <i class="fa fa-sign-out"
                           aria-hidden="true"></i> 退出
                    </a>
                </p>
            </nav>
        </div>
    </div>
</header>
<!--容器-->
<div class="container clearfix">
    <!--占位-->
    <#--    <div class="headerHightAdd" style=""></div>-->
    <!--左侧菜单栏-->
    <div class="Left fl" style="height: calc(100vh - 85px);top: 85px;background: #FFFFFF;">
        <div class="layui-row" id="project" style="padding: 0 15px">

            <div class="layui-col-xs9 layui-col-md3" style="width: 100%;border: 0;">
                <div>
                    <ul class="layui-menu" id="menus">
                        <#list menu as item>
                            <#if item.systemType == 7>
                                <#list item.children as child>
                                    <li class="layui-menu-item-group layui-menu-item-down"
                                        lay-options="{type: 'group'}">
                                        <div class="layui-menu-body-title first-menu" style="font-size: 16px">
                                            <img src="${child.bigicon}" style="width: 20px;height: 20px;margin: 2.5px;"
                                                 alt=""/>${child.name}<i class="layui-icon layui-icon-up"></i>
                                        </div>
                                        <ul>
                                            <#list  child.children  as thchild>
                                                <a href="javascript:void(0);" id="${thchild.id}"
                                                   lay-ay="${thchild.url}">
                                                    <li lay-options="" style="padding-left:25px"
                                                        onclick="clickOnTheMenu(this, '${thchild.bigicon}', ${thchild_index})">
                                                        <div class="layui-menu-body-title second-menu"
                                                             style="font-size: 14px">
                                                            <img src="${thchild.bigicon}"
                                                                 alt=""
                                                                 style="width: 20px;height: 20px;margin: 2.5px;"/>${thchild.name}
                                                        </div>
                                                    </li>
                                                </a>
                                            </#list>
                                        </ul>
                                    </li>
                                </#list>
                            </#if>
                        </#list>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <!--右侧内容-->
    <div id="ul_jl_tabs_content" class="Right fr fixRight"
         style="overflow-y: hidden;left: 14%;height: calc(100vh - 85px);top: 85px;">
    </div>
</div>
<!--JQ-->
<script type="text/javascript" charset="utf-8" src="${re.contextPath}/plugin/common/js/jquery-1.8.3.min.js"></script>
<script type="text/javascript" charset="utf-8" src="${re.contextPath}/plugin/common/js/tabs.js"></script>
<!--公用样式JS-->
<script type="text/javascript" charset="utf-8" src="${re.contextPath}/plugin/common/js/comment.js"></script>
<script type="text/javascript" src="${re.contextPath}/plugin/layui/layui.all.js" charset="utf-8"></script>
<script type="text/javascript" charset="utf-8" src="/plugin/it/common/js/itkl.js"></script>
<script type="text/javascript" src="${re.contextPath}/plugin/layui2.6.7/layui.js" charset="utf-8"></script>

<script>
    var element;
    let img = $('.second-menu');
    layui.use(['dropdown', 'util'], function () {
        var dropdown = layui.dropdown, util = layui.util, $ = layui.jquery;

        //菜单点击事件
        dropdown.on('click(project)', function (options) {
            var thisElem = $(this);
            console.log(thisElem, options);
        });


        util.event('lay-active', {
            normal: function () {
                $('#project').children().addClass('layui-col-md3').removeClass('layui-col-md4');
                $('#project').find('.layui-menu').removeClass('layui-menu-lg');
            }
            , lg: function () {
                $('#project').children().addClass('layui-col-md4').removeClass('layui-col-md3')
                $('#project').find('.layui-menu').addClass('layui-menu-lg');
            }
        });
    })

    $(function () {
        let firstsrc = img[0].getElementsByTagName('img')[0].src
        img[0].getElementsByTagName('img')[0].src = firstsrc.split('.png')[0] + '@point.png';
        $("#project a").click(function () {
            var that = $(this);
            $("#project").find(".focus").each(function (i, v) {
                $(v).removeClass('focus');
            });
            if (that.find('li').length > 0) {
                that.find('li').addClass('focus');
            } else {
                that.addClass('focus')
            }
            var title = that.find('span').first().text();
            var url = that.attr("lay-ay");
            _showtab(that.attr('id'), title, that.attr("lay-ay"));
        });
        $("#project div").click(function () {
            var that = $(this);
            $("#project").find(".focus").each(function (i, v) {
                $(v).removeClass('focus');
            });
            that.addClass('focus');
        });
        $(".Right").css({
            top: $(".headerHightAdd").height() + 'px',
        });
        $(".Left ul li div").each(function () {
            $(this).click(function () {
                $(this).parent().find("nav").toggle()
            });
        });

        $("#project a:eq(0)").click();

        var xfedit = localStorage.getItem('xfedit');
        var xmmc = localStorage.getItem('xmmc');
        var caseId = localStorage.getItem('caseId');
        if (xfedit) {
            _showtab('xm_e' + xfedit, '编辑-' + xmmc, '/supplier/projectManager/projectDetail?type=m&fix=e&supProjectId=' + xfedit + '&caseId=' + caseId);
            localStorage.removeItem("xfedit");
            localStorage.removeItem("xmmc");
            localStorage.removeItem("caseId");
        }

    })

    $(document).ready(function () {
        let list = $('#menus li ul li');
        list[0].setAttribute('class', 'layui-menu-item-checked');
    })


    function clickOnTheMenu(obj, urls, index) {
        let url = obj.getElementsByTagName('img')[0].src;
        console.log(url);
        if (url.indexOf('@point.png') == -1) {
            for (let i = 0; i < img.length; i++) {
                let src = img[i].getElementsByTagName('img')[0].src;
                if (src.indexOf('@point.png') != -1) {
                    img[i].getElementsByTagName('img')[0].src = src.split('@point.png')[0] + '.png'
                }
            }
            obj.getElementsByTagName('img')[0].src = url.split('.png')[0] + '@point.png';
        }
    }
</script>
</body>

</html>
